<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../common/mui/mui.min.css" rel="stylesheet" />
		<link href="../common/css/publicStyle.css" rel="stylesheet" />
		<link href="bus.css" rel="stylesheet" />
		<style>

		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<div id="navimg" style="text-align: center;"><img src="../common/images/logo-white.png" width="130px" height="20px">
			</div>
		</header>
		<div class="mui-content">
			<div id="slider" class="mui-slider">
				<div class="mui-slider-group">
					<div class="mui-slider-item">
						<div id="commuterBus" class="mui-scroll-wrapper">
							<div class="mui-scroll">
								<ul id="busUl" class="mui-table-view" style="font-size: 14px;">
									<li class="mui-table-view-cell mui-disabled borderLeft borderTop borderRight busLineHeigt borderBottom" style="font-size: 14px; color: red;">
										协和医院通勤班车表—上班
									</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="mui-slider-item">
						<div id="eastWestBus" class="mui-scroll-wrapper">
							<div class="mui-scroll">
								<ul id="" class="mui-table-view">
									<li class="mui-table-view-cell mui-disabled borderLeft borderTop borderRight busLineHeigt borderBottom" style="font-size: 14px; color: red;">
										协和医院（东-西）院通勤班车
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">序号</div>
										<div class="busTime busLineBg">东院至西院</div>
										<div class="busAddress borderBottom busLineBg">上车地点</div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">1</div>
										<div class="busTime">7:00</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">2</div>
										<div class="busTime busLineBg">7:15</div>
										<div class="busAddress">南门</div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">3</div>
										<div class="busTime">7:30</div>
										<div class="busAddress borderBottom"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">4</div>
										<div class="busTime busLineBg">9:40</div>
										<div class="busAddress busLineBg"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">5</div>
										<div class="busTime">12:45</div>
										<div class="busAddress busLineBg">外科楼南</div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">6</div>
										<div class="busTime busLineBg">14:30</div>
										<div class="busAddress borderBottom busLineBg"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">7</div>
										<div class="busTime">17:20</div>
										<div class="busAddress borderBottom">南门</div>
									</li>
									<li class="mui-table-view-cell mui-disabled separateLine"></li>
									<li class="mui-table-view-cell mui-disabled borderLeft borderTop borderRight busLineHeigt borderBottom" style="font-size: 14px; color: red;">
										协和医院（西-东）院通勤班车
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">序号</div>
										<div class="busTime busLineBg">西院至东院</div>
										<div class="busAddress borderBottom busLineBg">上车地点</div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">1</div>
										<div class="busTime">7:20</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">2</div>
										<div class="busTime busLineBg">10:40</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">3</div>
										<div class="busTime">11:40</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">4</div>
										<div class="busTime busLineBg">12:45</div>
										<div class="busAddress">中楼门口</div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">5</div>
										<div class="busTime">15:00</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">6</div>
										<div class="busTime busLineBg">16:40</div>
										<div class="busAddress"></div>
									</li>
									<li class="mui-table-view-cell public-flex-row busLineHeigt mui-disabled">
										<div class="busNo">7</div>
										<div class="busTime">18:20</div>
										<div class="busAddress borderBottom"></div>
									</li>
								</ul>

							</div>
						</div>
					</div>
				</div>
				<div class="mui-slider-indicator">
					<div class="mui-indicator mui-active"></div>
					<div class="mui-indicator"></div>
				</div>
			</div>
		</div>
		<script src="../common/mui/mui.min.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				plus.navigator.setStatusBarBackground('#24af96');
				plus.navigator.setStatusBarStyle('light');
				
				var _self = plus.webview.currentWebview();
				_self.setStyle({
					popGesture: 'none'  // 作用于ios 禁止右滑关闭
				});
				
				var width = window.screen.width;
				var height = window.screen.height - 64; //屏幕高
				var slider = document.getElementById('slider');
				slider.style.height = height + 'px';
				var commuterBus = document.getElementById('commuterBus');
				commuterBus.style.height = height + 'px';
				var eastWestBus = document.getElementById('eastWestBus');
				eastWestBus.style.height = height + 'px';
				mui('.mui-scroll-wrapper').scroll({
					indicators: true, //是否显示滚动条
				});
				commuterBusData();
				mui.back = function() {
					plus.navigator.setStatusBarBackground('#fff')
					plus.navigator.setStatusBarStyle('dark');
					_self.close("auto");
				}
			});

			function eastWestBusFile() {
				var eastWestBusLeftUl = document.getElementById('eastWestBusLeftUl');
				var eastWestBusRightUl = document.getElementById('eastWestBusRightUl');

			}

			function commuterBusData() {
				var busUl = document.getElementById('busUl');
				var onWorkData = [{ line: '线路', station: '站点' }, { line: '潘家园-协和', station: '潘家园—二环路建国门—协和医院' }, { line: '潘家园-协和', station: '潘家园—协和医院' }, { line: '天通苑-协和', station: '天通苑—立水苑—协和医院' }, { line: '立水桥-协和', station: '立水桥—北苑桥—协和医院' }, { line: '亚运村-协和', station: '亚运村医院—亚运村—奥体东门—科技馆—工人日报社—协和医院' }, { line: '定福庄-协和', station: '定福庄—朝阳路—协和医院' }, { line: '松榆里-协和', station: '松榆里—武圣路—劲松西口—劲松东—潘家园—光明桥—协和医院' }, { line: '草桥-协和', station: '草桥—刘家窑—玉蜓桥—协和医院' }, { line: '白纸坊-协和', station: '白纸坊桥北—草桥—右安南桥—木樨园桥西—协和医院' }, { line: '通州-协和', station: '八里桥—杨庄路口—协和医院' }, { line: '望京-协和', station: '花家地西里—京客隆—望京花园—上京小区—四环路东风桥—协和医院' }, { line: '方庄-协和', station: '方庄内（停5站）—建国门—协和医院' }, { line: '豆各庄-协和', station: '富力又一城—青青家园—万科青青—垡头（停3站）—紫南家园—化工路—双井—大北窑—协和医院' }, { line: '西三旗-协和', station: '育新花园—西三旗—健翔桥—马甸—协和医院' }, { line: '中关村-协和', station: '清华西门—北大东门—翠宫饭店—联想桥—蓟门小区—政法大学—文慧桥—协和医院' }, { line: '苹果园-协和', station: '苹果园—化肥厂路口—古城—京源路口—八宝山—玉泉路—永定路—五棵松—万寿路—公主坟—军博—西单—协和医院' }, { line: '双庙-协和', station: '双庙—方庄南路—方庄—左安门内—幸福大街—协和医院' }, { line: '玉桃园-协和', station: '玉桃园—二里沟东口—甘家口商场—协和医院' }];
				var offWorkData = [{ line: '线路', station: '站点' }, { line: '协和-潘家园', station: '协和医院—玉蜓桥—潘家园' }, { line: '协和-潘家园', station: '协和医院—肿瘤医院—潘家园' }, { line: '协和-天通苑', station: '协和医院—立水苑—天通苑' }, { line: '协和-立水桥', station: '协和医院—北苑桥—立水桥' }, { line: '协和-亚运村', station: '协和医院—雍和宫桥—工人日报社—科技馆—安贞医院—亚运村—亚运村医院' }, { line: '协和-定福庄', station: '协和医院—朝阳路—定福庄—杨闸' }, { line: '协和-松榆里', station: '协和医院—劲松西口—潘家园—武圣路—华威桥东—游泳馆—北工大—平乐园' }, { line: '协和-草桥', station: '协和医院—菜市口—草桥' }, { line: '协和-白纸坊', station: '协和医院—菜市口—白纸坊—草桥' }, { line: '协和-通州', station: '协和医院—杨庄路口—西门路口—八里桥' }, { line: '协和-望京', station: '协和医院—建国门—四环路东风桥—望京—上京小区—望京花园—京客隆—花家地西里' }, { line: '协和-方庄', station: '协和医院—崇文门—玉蜓桥—方庄（停5站）' }, { line: '协和-豆各庄', station: '协和医院—广渠门—双井—化工路—紫南家园—垡头—万科青青—青青家园—富力又一城' }, { line: '协和-西三旗', station: '协和医院—马甸—祁家豁子—健翔桥—306医院—南沙滩—西三旗—育新花园—北新家园—新都' }, { line: '协和-中关村', station: '协和医院—文慧桥—枫蓝国际—蓟门桥—蓟门小区—联想桥—翠宫饭店—五道口—清华西门' }, { line: '协和-苹果园', station: '协和医院—西单—军博—公主坟—万寿路—五棵松—永定路—玉泉路—八宝山—京源路口—古城—化肥厂路口—苹果园' }, { line: '协和-双庙', station: '协和医院—幸福大街—左安门内—方庄—方庄南路—宋家庄—双庙' }, { line: '协和-玉桃园', station: '协和医院—甘家口商场—二里沟东口—玉桃园' }];

				var oneliHtml = '<li class="mui-table-view-cell mui-disabled public-flex-row minTableHeight"><div class="onWorkLine">线路</div><div class="onWorkContent">站点</div></li>';
				for(var i = 0; i < onWorkData.length; i++) {
					busUl.innerHTML += oneliHtml;
				}
				busUl.innerHTML += '<li class="mui-table-view-cell mui-disabled separateLine"></li><li class="mui-table-view-cell mui-disabled borderLeft borderTop borderRight busLineHeigt borderBottom" style="font-size: 14px; color: red;">协和医院通勤班车表-下班</li>';

				for(var i = 0; i < offWorkData.length; i++) {
					busUl.innerHTML += oneliHtml;
				}

				var allLine = busUl.querySelectorAll('.onWorkLine');
				var allContent = busUl.querySelectorAll('.onWorkContent');
				for(var i = 0; i < allLine.length; i++) {
					var oneData = onWorkData[i];
					if(i >= onWorkData.length) {
						oneData = offWorkData[i - onWorkData.length];
					}
					var onWorkLine = allLine[i];
					var onWorkContent = allContent[i];
					onWorkLine.innerText = oneData.line;
					onWorkContent.innerText = oneData.station;
					onWorkLine.style.fontSize = '13px';
					onWorkContent.style.fontSize = '13px';

					if(i < onWorkData.length) {
						if(i % 2 == 0) {
							onWorkLine.style.background = '#d6eceb';
							//				onWorkLine.style.lineHeight = '40px';
							onWorkContent.style.background = '#d6eceb';
							//				onWorkContent.style.lineHeight = '40px';

						}
					} else {
						if(i % 2 == 1) {
							onWorkLine.style.background = '#ebd7d7';
							onWorkContent.style.background = '#ebd7d7';
						}
					}
				}
			}
		</script>
	</body>

</html>